<template>
  <div class="container">
    <div class="container-main h100">
      <el-collapse v-model="activeNames">
        <el-collapse-item name="1">
          <template slot="title"> 线路状态汇总 </template>
          <base-table :tableSetting="lineConfig"></base-table>
        </el-collapse-item>
        <el-collapse-item name="2">
          <template slot="title"> 机组状态汇总 </template>
          <base-table :tableSetting="unitConfig"></base-table>
        </el-collapse-item>
        <el-collapse-item name="3">
          <template slot="title"> 主变状态汇总 </template>
          <base-table :tableSetting="mainTransformerConfig"></base-table>
        </el-collapse-item>
      </el-collapse>
    </div>
  </div>
</template>

<script>
import {
  lineInfo,
  unitInfo,
  mainTransformerInfo,
} from "@/api/operationManagement/dispatchManagement.js";
export default {
  data() {
    return {
      activeNames: ["1", "2", "3"],
      // 线路状态汇总列表信息
      lineConfig: {
        indexShow: true,
        // 表头
        column: [
          {
            label: "设备管理单位",
            prop: "deptManageName",
            required: true,
          },
          {
            label: "线路名称",
            prop: "equipmentName",
            required: true,
          },
          {
            label: "当前状态",
            prop: "afterStatus",
            required: true,
            width: "100px",
            formatter: (row) => {
              let types = this.$store.getters["dirtData"](
                "dispatch_change_type"
              );
              let val = row.afterStatus;
              if (val) {
                let obj = types.find((i) => i.value == val);
                return obj ? obj.label : val;
              } else {
                return "-";
              }
            },
          },
          {
            label: "事故跳闸次数（本月）",
            prop: "monthTrip",
            required: true,
          },
          {
            label: "事故跳闸次数（本年）",
            prop: "yeartTrip",
            required: true,
          },
          {
            label: "停电检修次数（本月）",
            prop: "monthPowerCut",
            required: true,
          },
          {
            label: "停电检修次数（本年）",
            prop: "yearPowerCut",
            required: true,
          },
        ],
        data: [],
        noBorderRight: true,
        autoHeight: true,
        rowIndex: 0,
        // 合并表格
        spanMethod({ row, column, rowIndex, columnIndex }) {
          // 合并列下标对应columnIndex 以及 返回数组的第二个参数
          if (columnIndex === 1) {
            if (row.mergeLength) {
              // 如果有值,说明需要合并
              return [row.mergeLength, 1];
            } else {
              return [0, 0];
            }
          }
        },
      },
      // 机组状态汇总列表信息
      indexShow: true,
      unitConfig: {
        // 表头
        indexShow: true,
        column: [
          {
            label: "设备管理单位",
            prop: "deptManageName",
            required: true,
          },
          {
            label: "机组号",
            prop: "equipmentName",
            required: true,
          },
          {
            label: "当前状态",
            prop: "afterStatus",
            required: true,
            width: "100px",
            formatter: (row) => {
              let types = this.$store.getters["dirtData"](
                "dispatch_change_type"
              );
              let val = row.afterStatus;
              if (val) {
                let obj = types.find((i) => i.value == val);
                return obj ? obj.label : val;
              } else {
                return "-";
              }
            },
          },
          {
            label: "不可用累计时间(小时)-本月",
            prop: "monthDisabled",
            required: true,
          },
          {
            label: "不可用累计时间(小时)-本年",
            prop: "yeartDisabled",
            required: true,
          },
          {
            label: "最近大修完成时间",
            prop: "lastOverhaulTime",
            required: true,
          },
        ],
        data: [],
        noBorderRight: true,
        autoHeight: true,
        rowIndex: 0,
        // 合并表格
        spanMethod({ row, column, rowIndex, columnIndex }) {
          // 合并列下标对应columnIndex 以及 返回数组的第二个参数
          if (columnIndex === 1) {
            if (row.mergeLength) {
              // 如果有值,说明需要合并
              return [row.mergeLength, 1];
            } else {
              return [0, 0];
            }
          }
        },
      },
      // 主变状态汇总列表信息
      mainTransformerConfig: {
        indexShow: true,
        // 表头
        column: [
          {
            label: "设备管理单位",
            prop: "deptManageName",
            required: true,
          },
          {
            label: "主变号",
            prop: "equipmentName",
            required: true,
          },
          {
            label: "当前状态",
            prop: "afterStatus",
            required: true,
            width: "100px",
            formatter: (row) => {
              let types = this.$store.getters["dirtData"](
                "dispatch_change_type"
              );
              let val = row.afterStatus;
              if (val) {
                let obj = types.find((i) => i.value == val);
                return obj ? obj.label : val;
              } else {
                return "-";
              }
            },
          },
          {
            label: "不可用累计时间(小时)-本月",
            prop: "monthDisabled",
            required: true,
          },
          {
            label: "不可用累计时间(小时)-本年",
            prop: "yeartDisabled",
            required: true,
          },
        ],
        data: [],
        noBorderRight: true,
        autoHeight: true,
        rowIndex: 0,
        // 合并表格
        spanMethod({ row, column, rowIndex, columnIndex }) {
          // 合并列下标对应columnIndex 以及 返回数组的第二个参数
          if (columnIndex === 1) {
            if (row.mergeLength) {
              // 如果有值,说明需要合并
              return [row.mergeLength, 1];
            } else {
              return [0, 0];
            }
          }
        },
      },
    };
  },
  created() {
    this.getLineTable();
    this.getUnitTable();
    this.getMainTransformerTable();
  },
  methods: {
    // 查询线路状态汇总列表
    async getLineTable(params) {
      let queryData = Object.assign({}, params);
      let { data } = await lineInfo(queryData);
      let list = this.tableData(data);
      this.lineConfig.data = list;
    },
    // 查询机组状态汇总列表
    async getUnitTable(params) {
      let queryData = Object.assign({}, params);
      let { data } = await unitInfo(queryData);
      let list = this.tableData(data);
      this.unitConfig.data = list;
    },
    // 查询主变状态汇总列表
    async getMainTransformerTable(params) {
      let queryData = Object.assign({}, params);
      let { data } = await mainTransformerInfo(queryData);
      let list = this.tableData(data);
      this.mainTransformerConfig.data = list;
    },
    // 处理表格数据
    tableData(data) {
      let indexList = [0];
      let sum = 0;
      let sumList = [];
      let sameDeptName = data[0].deptManageName;
      for (let i = 0; i < data.length; i++) {
        if (sameDeptName == data[i].deptManageName) {
          sum = sum + 1;
          if (data.length - 1 == i) {
            sumList.push(sum);
          }
        } else {
          sameDeptName = data[i].deptManageName;
          indexList.push(i);
          sumList.push(sum);
          sum = 0;
          i--;
        }
      }
      for (let i = 0; i < indexList.length; i++) {
        data[indexList[i]].mergeLength = sumList[i];
      }
      return data;
    },
  },
};
</script>

<style lang="less" scoped>
.container {
  width: 100%;
  height: 100%;
  .container-main {
    overflow-y: auto;
  }
  /deep/ .table-search--action {
    display: none;
  }
  /deep/ .header--btnNoOver {
    display: none;
  }
  /deep/ .el-collapse-item__content {
    padding: 0;
  }
}
</style>